// pages/songDetail/songDetail.js
import PubSub from 'pubsub-js'
import request from '../../utils/request.js'
import moment from 'moment'
const appInstance = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    isPlay: false,//标识音乐是否播放
    song: {},//歌曲详情对象
    musicId: '',//音乐id
    musicLink: '',//音乐的链接
    currentTime: '00:00',//开始时间
    durationTime: '00:00',//结束时间
    currentWidth:0,//默认宽度，实时进度条
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    let musicId = options.musicId
    //获取当前音乐详情
    this.getMusicInfo(musicId)
    this.setData({
      musicId
    })
    //判断当前页面音乐有没有在播放
    if (appInstance.globalData.isMusiPlay && appInstance.globalData.musicId === musicId) {
      //修改当前页面音乐播放状态为true
      this.setData({
        isPlay: true
      })
    }
  },
  //控制播放
  handleMusicPlay() {
    let isPlay = !this.data.isPlay
    //修改播放状态
    // this.setData({
    //   isPlay
    // }) 
    let { musicId, musicLink } = this.data
    this.musicContril(isPlay, musicId, musicLink)

    //创建音乐实例
    this.backgroundAudioManager = wx.getBackgroundAudioManager()

    //控制音乐系统的播放/暂停/停止
    this.backgroundAudioManager.onPlay(() => {
      //修改音乐播放状态
      // this.setData({
      //   isPlay: true
      // })
      this.changePlayState(true)
      //如果在播放就修改全局的播放
      appInstance.globalData.musicId = musicId
    })
    this.backgroundAudioManager.onPause(() => {
      //修改音乐播放状态
      // this.setData({
      //   isPlay: false
      // })
      this.changePlayState(false)

    })
    this.backgroundAudioManager.onStop(() => {
      //修改音乐播放状态
      // this.setData({
      //   isPlay: false 
      // })
      this.changePlayState(false)
    })
    //监听音乐实时播放的进度
    this.backgroundAudioManager.onTimeUpdate(() => {
      //格式是实时时间
      let currentTime = moment(this.backgroundAudioManager.currentTime * 1000).format('mm:ss')
      // 实时宽度=当前时间/总时间=当前宽度/总宽度
      let currentWidth=this.backgroundAudioManager.currentTime/this.backgroundAudioManager.duration*450

      this.setData({
        currentTime,
        currentWidth
      })
    })

    //监听音乐播放自然结束
    this.backgroundAudioManager.onEnded(() => {
      //结束了自动下一首

    //发布状态
    PubSub.publish('switchType', 'next')
    //更新长度
      this.setData({
        currentWidth:0,
        currentTime: '00:00'
      })
    })
  },
  //修改播放状态功能函数
  changePlayState(isPlay) {
    this.setData({
      isPlay
    })
    appInstance.globalData.isMusicPlay = isPlay
  },
  //获取音乐详情功能函数
  async getMusicInfo(musicId) {
    let songData = await request('/song/detail', { ids: musicId })
    // 转换时间格式
    let durationTime = moment(songData.songs[0].dt).format('mm:ss')

    this.setData({
      song: songData.songs[0],
      durationTime
    })
    //动态修改窗口的标题
    wx.setNavigationBarTitle({
      title: this.data.song.name
    })
  },
  // 控制音乐播放暂停与播放
  async musicContril(isPlay, musicId, musicLink) {
    if (isPlay) {
      //如果没有
      if (!musicLink) {
        //音乐播放
        let musicLinkData = await request('/song/url', { id: musicId })
        musicLink = musicLinkData.data[0].url
        this.setData({
          musicLink
        })
      }
      //创建控制音乐播放的实例对象
      //修改音乐链接
      this.backgroundAudioManager.src = musicLink
      this.backgroundAudioManager.title = this.data.song.name
    } else {
      //音乐暂停
      this.backgroundAudioManager.pause()
    }
  },
  //点击切割的函数
  handleSwitch(event) {
    let type = event.currentTarget.id
    //关闭当前音乐
    //音乐暂停
    this.backgroundAudioManager.pause()

    //订阅来自recommendSong发布的消息
    PubSub.subscribe('musicId', (msg, musicId) => {
      // 重新获取音乐
      this.getMusicInfo(musicId)
      // 自动播放当前音乐
      this.musicContril(true, musicId)
      // console.log(msg,musicId);
      //取消订阅
      PubSub.unsubscribe('musicId')
    })
    PubSub.publish('switchType', type)
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})